<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>

<html>
<head>
<link rel="stylesheet" type="text/css" href="public/mystyle2.css" />
<!-- link rel="stylesheet" type="text/css" href="public/mystyle.css" /-->
<script language="javascript" src="scripts/jquery.js"></script>
<script language="javascript" src="scripts/passwordStrengthMeter.js"></script>
<script language="javascript">
	jQuery(document).ready(function() {
		$('#username').keyup(function(){$('#result').html(passwordStrength($('#password').val(),$('#username').val()))})
		$('#password').keyup(function(){$('#result').html(passwordStrength($('#password').val(),$('#username').val()))})
	})
	function showMore()
	{
		$('#more').slideDown();
	}
</script>
<title>Create an Account</title>


<style type="text/css">
body,html {
	margin: 0;
	padding: 0
}

img {
	position: absolute;
	z-index: -1;
	width: 40%;
	height: 85%
}
</style>



</head>

<body>


	<h1 style="font-size: 150%">&nbsp;&nbsp;&nbsp;Get started with Taha mail</h1>

	<form method="post" action="CreateAccountController">
	
		<table width="770" cellspacing="5" cellpadding="6" border="0"
			align="center" background="public/pink079.gif">
			<tbody>

				<tr>
					
				</tr>

				<tr>
					<td> First Name :&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp
						<input type="text" name="firstname" value='${param.firstname} '
						color="blue" /> </br></td>
				</tr>
				<tr>
					<td>Last Name :
						&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
						<input type="text" name="lastname" value='${param.lastname} ' />

						</br></td>
				</tr>
				<tr>
					<td>User Name :
						&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
						<input type="text" name="username" id="username"
						value='${param.username} ' />
					</td>
				</tr>
				<tr>
					<td>
						<div align="left" style="display: block;">
							<font size="-1" face="Arial, sans-serif" color="red"> <c:if
									test="${ UserNameAvailability !=null}">
			          &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			     &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
							&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;           <b>
										${UserNameAvailability}</b>
								</c:if> </font>
						</div></td>
				</tr>
				<tr>
					<td><br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
						&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
						&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp; <input
						type="submit" name="check" value="check availability!"> <br>
					<br></td>
				</tr>

				<tr>
					<td>Password :
						&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
						<input name="password" id="password" type="password" /> &nbsp;
						&nbsp;&nbsp;&nbsp;&nbsp;<span
						style="color: green; font: bold; font-size: large;" id='result'></span>
					</td>
				</tr>
				<tr>
					<td>
						<div align="left" style="display: block;">
							<font size="-1" face="Arial, sans-serif" color="red"> <c:if
									test="${ pass_TooShort !=null}">
			     &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			     &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
							&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;                
							             <b> ${pass_TooShort} </b>
								</c:if> <c:if test="${ dontMatch !=null}"> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			     &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
							&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;    
		<b> ${dontMatch} </b>
								</c:if> </font>
						</div></td>
				</tr>

				<tr>
					<td>Re-enter Password :&nbsp;&nbsp;&nbsp; <input
						type="password" name="reEnterpassword" /></td>
				</tr>
				<tr>
					<td>
						<div align="left" style="display: block;">
							<font size="-1" face="Arial, sans-serif" color="red"> <c:if
									test="${ notfilled !=null}"> 
			                   &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			     &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
							&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;     <b>
										${notfilled} </b>
								</c:if> <br /> </font>
						</div></td>
				</tr>
				<tr>

					<td><input type="submit" name="create"
						value="Create My Account" /></td>
				</tr>
			</tbody>
		</table>
	</form>




</body>
</html>
